<template>
  <div class="card-container">
    <a-card title="功能模块" style="padding: 15px">
      <a-card-grid
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/account')"
      >
        <a-card-meta title="平台账号" description="查看多个平台账号，统一管理">
          <template #avatar>
            <UserOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
      <a-card-grid
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/system-setting')"
      >
        <a-card-meta title="系统设置" description="核心自动化功能设置，提高运营效率">
          <template #avatar>
            <SettingOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
      <a-card-grid
        v-if="brandStore.promotionCenter"
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/promotion-center')"
      >
        <a-card-meta
          title="推广中心"
          description="助力平台，推广得积分，共同提高行业效率
"
        >
          <template #avatar>
            <SlackOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
      <a-card-grid
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/intelligent-qa')"
      >
        <a-card-meta title="智能问答" description="关键字词，自动回复，提高粉丝体验">
          <template #avatar>
            <RobotOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
      <a-card-grid
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/order')"
      >
        <a-card-meta title="订单管理" description="查看成交订单，实时查看订单利润">
          <template #avatar>
            <OrderedListOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
      <a-card-grid
        style="width: 33.3%; padding: 30px; cursor: pointer"
        :bordered="false"
        @click.prevent="skip('/my-fans')"
      >
        <a-card-meta title="粉丝管理" description="查看平台账号粉丝，精准营销">
          <template #avatar>
            <TeamOutlined style="color: #1890ff; font-size: 18px" />
          </template>
        </a-card-meta>
      </a-card-grid>
    </a-card>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router'
import { useBrandStore } from '@/store/modules/brand'

const brandStore = useBrandStore()

const router = useRouter()

const skip = e => {
  // console.log(232424);
  router.push(e)
}
</script>

<style lang="less" scoped>
.card-container {
  .project-list {
    padding: 30px 20px;
    cursor: pointer;
  }
}
</style>
